<template>
  <div>
    <max-panel title="基础使用：">
      <max-button @click="click">打开弹窗</max-button>
      <max-modal :title="title" v-model:visible="visible">
        <max-input type="default">默认状态:</max-input>
        <max-input type="disabled">禁止状态:</max-input>
        <max-input type="loading">加载状态:</max-input>
      </max-modal>
    </max-panel>
  </div>
</template>

<script>

import {defineComponent, nextTick, ref} from "vue";
import MaxButton from "@/components/base/maxButton";

export default defineComponent({
  setup() {
    /**
     * 变量列表：
     * visible：弹窗可见
     */
    const visible = ref(false);
    const title = ref('测试弹窗');
    /**
     * 方法列表：
     * click：点击事件
     */
    const click = () => {
      visible.value = true;
    }
    /**
     * 初始化
     */
    nextTick(() => {
    });

    return {
      title,
      visible,
      click
    };
  }
});
</script>

<style scoped>

</style>